<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>test01</title>
    <style type="text/css">
      div {
        width: 100px;
        height: 100px;
        background:yellowgreen ;
        position: absolute;

        animation: infinite 10s linear mymove;
        animation-play-state: running;
      } 

      @keyframes mymove {
        0%{left:0px; top: 0px; }
        25%{left: 100%; top: 0px; transform: translateX(-100%);}
        50%{left: 100%;  top: 900px; transform: translateX(-100%);}
        75%{left: 50px; top: 900px;}
        100%{left: 0px; top: 0px;}
      }
    
    </style>
  </head>
  <body>
    <div></div>
  </body>
</html>